@charset "utf-8";
/* CSS Document */
body, nav, span, p, var, em, strong, a, h1, h2, h3, h4, h5, input, textarea, ul, ol, li, img {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-family: "微软雅黑";
}

.clear {
    clear: both;
    height: 0;
    overflow: hidden;
}

a img {
    border: none;
}

a {
    text-decoration: none;
    cursor: pointer;
}

var, em {
    font-style: normal;
}

ul, ol {
    list-style-type: none;
}

.slideBox {
    width: 100%;
    height: 446px;
    overflow: hidden;
    position: relative;
    min-width: 990px;
}

.slideBox .hd {
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    bottom: 5px;
    z-index: 1;
}

.slideBox .hd ul {
    overflow: hidden;
    zoom: 1;
    float: left;
}

.slideBox .hd ul li {
    cursor: pointer;
    width: 3em;
    height: 6px;
    background: #E7AC22;
    float: left;
    margin: 0 .5em;
}

.slideBox .hd ul li.on {
    background: red !important;
}

.slideBox .bd {
    height: 446px;
    width: 100%;
    z-index: 0;
}

.slideBox .bd ul li {
    overflow: hidden;
    width: 100%;
    height: 446px;
    position: relative;
}

.slideBox .bd li a {
    display: block;
    width: 990px;
    height: 446px;
    margin: 0 auto;
    position: relative;
}

/*第四屏*/
.banner1 {
    width: 100%;
    height: 28.6em;
    background: linear-gradient(right, #041F4C 50%, #BE6E83 50%);
    background: -moz-linear-gradient(right, #041F4C 50%, #BE6E83 50%);
    background: -webkit-linear-gradient(right, #041F4C 50%, #BE6E83 50%);
    background: -ms-linear-gradient(right, #041F4C 50%, #BE6E83 50%);
}

.content1 {
    width: 990px;
    height: 446px;
    margin: 0 auto;
    background: linear-gradient(right top, #041F4C 33%, #BE6E83 67%);
    background: -moz-linear-gradient(right top, #041F4C 33%, #BE6E83 67%);
    background: -webkit-linear-gradient(right top, #041F4C 33%, #BE6E83 67%);
    background: -ms-linear-gradient(right top, #041F4C 33%, #BE6E83 67%);
    position: relative;
}

.b2_word {
    margin: 7em 0 0 3em;
    float: right;
}

.b2_word span {
    background: url(../images/yidong.png) no-repeat;
    width: 10.3em;
    height: 6.78em;
    float: left;
}

.b2_word var {
    color: #FFFFFF;
    font-size: 3.2em;
    float: left;
    margin: 0.2em 0.2em;
}

.animation20 {
    background: url(../images/banner2.png) no-repeat;
    width: 44em;
    height: 28.6em;
    float: left;
    -webkit-animation: flash 2s .2s ease both;
    -moz-animation: flash 2s .2s ease both;
}

@-webkit-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-ms-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.animation21 {
    -webkit-animation: fadeInDown 2s .2s ease both;
    -moz-animation: fadeInDown 2s .2s ease both;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-1.5em)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInDown {
    0% {
        opacity: 0;
        -moz-transform: translateY(-1.5em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
}

@-ms-keyframes fadeInDown {
    0% {
        opacity: 0;
        -ms-transform: translateY(-1.5em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateY(0)
    }
}

#a24 {
    position: absolute;
    left: 27em;
    top: 9.5em;
    margin: -1em 0 0 -9em;
    color: #FFFFFF;
    font-size: 1.9em;
    border: 1px solid #fff;
    height: 2em;
    line-height: 2em;
    border-radius: 2em;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    width: 18.5em;
    text-align: center;
}

.animation22 {
    -webkit-animation: fadeInRight 1s .2s ease both;
    -moz-animation: fadeInRight 1s .2s ease both;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2em)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(2em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-ms-keyframes fadeInRight {
    0% {
        opacity: 0;
        -ms-transform: translateX(2em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
}

/*新添加一屏*/
.slide ul li.banner5 {
    width: 100%;
    height: 28.6em;
    background: url(../images/chunjie.png) center center no-repeat;
}

/*第一屏*/
.slide ul li.banner2 {
    width: 100%;
    height: 28.6em;
    background: url(../images/banner2_1.jpg) center center no-repeat;
}

.content2 {
    width: 70.7em;
    height: 28.6em;
    margin: 0 auto;
    position: relative;
    display: inline-block;
}

.animation5 {
    background: url(../images/banner2_04.png) no-repeat;
    width: 302px;
    height: 77px;
    position: absolute;
    right: 24%;
    top: 55%;
    -webkit-animation: flash 3s 1s ease both;
    -moz-animation: flash 3s 1s ease both;
}

@-webkit-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-ms-keyframes flash {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.animation3 {
    background: url(../images/banner2_02.png) center center no-repeat;
    width: 340px;
    height: 43px;
    position: absolute;
    top: 23%;
    left: 26%;
    -webkit-animation: fadeInDown 2s 1s ease both;
    -moz-animation: fadeInDown 2s 1s ease both;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px)
    }
    30% {
        opacity: 0.6;
        -webkit-transform: translateY(200px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateY(-10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px)
    }
    30% {
        opacity: 0.6;
        -webkit-transform: translateY(200px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateY(-10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-ms-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-200px)
    }
    30% {
        opacity: 0.6;
        -webkit-transform: translateY(200px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateY(-10px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

.animation4 {
    background: url(../images/banner2_05.png) center center no-repeat;
    width: 702px;
    height: 128px;
    position: absolute;
    left: 16%;
    top: 30%;

    -webkit-animation: fadeInRight 2s ease both;
    -moz-animation: fadeInRight 2s ease both;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-10%)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(2em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-ms-keyframes fadeInRight {
    0% {
        opacity: 0;
        -ms-transform: translateX(2em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
}

/*第三屏*/
.slide ul li.banner3 {
    width: 100%;
    height: 28.6em;
    background: url(../images/banner3.jpg) center center no-repeat;
}

.content3 {
    width: 70.7em;
    height: 28.6em;
    margin: 0 auto;
    display: inline-block;
}

.animation6 {
    background: url(../images/idc.png) no-repeat;
    width: 19em;
    height: 6em;
    margin: 2.35em 0 0 8.6em;
    float: left;
    -webkit-animation: bounceInDown 1s .2s ease both;
    -moz-animation: bounceInDown 1s .2s ease both;
}

@-webkit-keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateY(30px)
    }
    80% {
        -webkit-transform: translateY(-10px)
    }
    100% {
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes bounceInDown {
    0% {
        opacity: 0;
        -moz-transform: translateY(-2000px)
    }
    60% {
        opacity: 1;
        -moz-transform: translateY(30px)
    }
    80% {
        -moz-transform: translateY(-10px)
    }
    100% {
        -moz-transform: translateY(0)
    }
}

@-ms-keyframes bounceInDown {
    0% {
        opacity: 0;
        -ms-transform: translateY(-2000px)
    }
    60% {
        opacity: 1;
        -ms-transform: translateY(30px)
    }
    80% {
        -ms-transform: translateY(-10px)
    }
    100% {
        -ms-transform: translateY(0)
    }
}

#a9, #a10 {
    opacity: 0;
    filter: alpha(opacity=0);
}

.animation7 {
    font-size: 3.2em;
    width: 100%;
    float: left;
    margin: 0.7em 0 0 2.5em;
    font-weight: bold;
    color: #333;
    -webkit-animation: fadeInDown 1s .2s ease both;
    -moz-animation: fadeInDown 1s .2s ease both;
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2em)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInDown {
    0% {
        opacity: 0;
        -moz-transform: translateY(-2em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
}

@-ms-keyframes fadeInDown {
    0% {
        opacity: 0;
        -ms-transform: translateY(-2em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateY(0)
    }
}

.animation7 span {
    color: #009EFE;
    font-size: 1em;
}

/*新添第二屏*/
.slide ul li.banner4 {
    width: 100%;
    height: 28.6em;
    background: url(../images/banner4.png) center center no-repeat;
}

.animation8 {
    background: url(../images/banner4_2.png) no-repeat;
    width: 1019px;
    float: right;
    top: 0;
    margin-top: 150px;
    right: 0;
    position: absolute;
    -webkit-animation: fadeInRightBig 3s .5s ease both;
    -moz-animation: fadeInRightBig 3s .5s ease both;
}

@-webkit-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translateX(13em)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -moz-transform: translateX(13em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-ms-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -ms-transform: translateX(13em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
}

.animation9 {
    background: url(../images/banner4_1.png) no-repeat;
    width: 1200px;
    margin: 0 auto;
    float: none;
    margin-top: 150px;
    -webkit-animation: fadeInLeftBig 3s .5s ease both;
    -moz-animation: fadeInLeftBig 3s .5s ease both;
}

@-webkit-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-20em)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -moz-transform: translateX(-20em)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-ms-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -ms-transform: translateX(-20em)
    }
    100% {
        opacity: 1;
        -ms-transform: translateX(0)
    }
}